@mixin bg-variant($parent, $color) {
  #{$parent} {
    background-color: $color !important;
  }
  a#{$parent}:hover,
  a#{$parent}:focus {
    background-color: darken($color, 10%) !important;
  }
}

@mixin bg-linear($parent, $color1, $color2) {
  #{$parent} {
    background-image: linear-gradient(to right, $color1, $color2);
  }
}

@mixin bg-hover($parent, $color) {
  #{$parent}:hover,
  #{$parent}:focus {
    background-color: $color !important;
  }
}
